<template>
    <div class="container">
        <HomeHeader></HomeHeader>
        <div class="main">
            <HomeAside class="mainAside" :aside="asideList"></HomeAside>
            <div class="mainStyle">
                <router-view />
            </div>
        </div>
    </div>
    <BaseMask class="mask"></BaseMask>
</template>

<script lang="ts" setup name="adminIndex">
import { HomeAside, HomeHeader } from '@components/HomeComponents/index'
import { BaseMask } from '@components/BaseForm'
import asideList from '../admin-index/asideData'
</script>

<style lang="less" scoped>
.container {
    height: 100%;
    width: 100%;
    .main{
        height: calc(100% - 60px);
        width: 100%;
        margin-top: 10px;
        display: flex;
        justify-content: space-between;
        .mainAside{
            width: 300px;
        }
        .mainStyle {
            width: calc(100% - 300px);
        }
    }
}
.mask{
    z-index: -1;
}
</style>